<template>
  <van-nav-bar title="订单详情" left-arrow @click-left="onBack" />

  <div class="near-box">
    <div class="jd-qrdd-bigbox">
      <!--商品地址管理部分-->
      <!-- <div class="indent-details-box">
                <span class="indent-details-img1"></span>
                <span class="indent-details-text1"></span>
                <span class="indent-details-text2">物流信息：客户签收人：邮件收发 已签收 感谢使用圆通快递，期待再次为您服务！</span>
                <span class="indent-details-text3">2017-10-23 12:25:12</span>
            </div> -->
      <!--地址部分-->
      <div class="jd-qrdd-a1">
        <span class="qrdd-a1-t1">{{ info.address.consignee }}</span>
        <span class="qrdd-a1-t1">{{ info.address.mobile }}</span>
        <span class="qrdd-a1-t2" v-if="info.address.status == 1">默认</span>
        <div class="qrdd-a1-b1">
          <span class="qrdd-a1-img1"></span>
          <span class="qrdd-a1-t3"
            >{{ info.address.region_text }} {{ info.address.address }}</span
          >
        </div>
        <span class="qrdd-a1-img2"></span>
      </div>
      <!--商品部分-->
      <div class="zjzz-buylist-goods1">
        <div class="zjzz-buylist-gtime">
          <!-- <span class="zjzz-buylist-gtime1"><i class="indent-details-img2"></i>保洁官方旗舰店</span> -->
          <span class="zjzz-buylist-gtime2">{{ info.order.status_text }}</span>
        </div>
        <div
          class="zjzz-buylist-det"
          v-for="item of info.product"
          :key="item.id"
        >
          <img :src="item.products.cover_cdn" />
          <div class="zjzz-buylist-gdetail">
            <span class="zjzz-buylist-gtit1">{{ item.products.name }}</span>
            <span class="zjzz-buylist-gmoney">
              <i class="zjzz-buylist-gm1">￥ {{ item.total }}</i>
              <i class="zjzz-buylist-gm2">x{{ item.pronum }}</i>
            </span>
          </div>
        </div>
        <div class="zjzz-buylist-btn">
          <a class="zjzz-buylist-btn3">申请售后</a>
        </div>
      </div>
      <!--商品金额部分-->
      <div class="indent-details-box2">
        <span class="indent-details-text4">应付总额</span>
        <span class="indent-details-text5">￥{{ info.order.amount }}</span>
      </div>
      <div class="indent-details-box2">
        <span class="indent-details-text4 tcolor-grey">商品总价</span>
        <span class="indent-details-text5 tcolor-black"
          >￥{{ info.order.amount }}</span
        >
      </div>
      <!-- <div class="indent-details-box2">
                <span class="indent-details-text4 tcolor-grey">运费</span>
                <span class="indent-details-text5 tcolor-black">￥0.00</span>
            </div>
            <div class="indent-details-box2">
                <span class="indent-details-text4 tcolor-grey">税费</span>
                <span class="indent-details-text5 tcolor-black">￥0.00</span>
            </div>
            <div class="indent-details-box2">
                <span class="indent-details-text4 tcolor-grey">发票信息</span>
                <span class="indent-details-text5 tcolor-black">不需要发票</span>
            </div> -->
      <!--订单编号部分-->
      <div class="indent-details-box3">
        <p>订单编号:{{ info.order.code }}</p>
        <!-- <p>支付方式:支付宝</p>
                <p>支付交易单号:201711024866544846144</p> -->
        <p>下单时间:{{ info.order.createtime_text }}</p>
      </div>
    </div>
  </div>
</template>
<script>
import { showNotify } from "vant";
export default {
  data() {
    return {
      orderid: 0,
      info: {
        order: {},
        address: {},
        product: [],
      },
    };
  },
  created() {
    this.orderid = this.$route.query.orderid ? this.$route.query.orderid : 0;

    this.getOrderInfo();
  },
  methods: {
    onBack() {
      this.$router.go(-1);
    },
    async getOrderInfo() {
      let data = {
        orderid: this.orderid,
      };

      let result = await this.$api.OrderInfo(data);

      if (result.code === 0) {
        showNotify({
          type: "warning",
          message: result.msg,
          onClose: () => {
            this.$router.go(-1);
          },
        });

        return false;
      }

      this.info = result.data;

      // console.log(this.info.product);
    },
  },
};
</script>

<style>
@import url("/assets/css/indent-details.css");
</style>